import defaltImg from '@/assets/images/200.png'
import { useIntersectionObserver } from '@vueuse/core'
export default {
  install (app) {
    // 定义全局指令
    app.directive('imgLazy', {
      mounted (el, binding) {
        // console.log(el, binding)
        const { stop } = useIntersectionObserver(el, ([{ isIntersecting }], observerElement) => {
          if (isIntersecting) {
            // 当图片url无效加载失败的时候使用默认图片替代
            el.onerror = () => {
              el.src = defaltImg
            }
            el.src = binding.value
            stop()
          }
        })
      }
    })
  }
}
